@charset "UTF-8";
/**
 * 
 * @authors 3pixel (kermit@piexl.net)
 * @date    2017-11-30 12:01:00
 * @version v0.0.1
 */
//引入变量
@import "variable.less";

//引入混合函数
@import "mixins.less";

//点赞按钮
.btn-thumb{
	padding:0.2em 0.8em;
	color:#fff;
	font-size:30px;
	line-height:1;
	border:0;
	i{font-size:30px;}
	.border-radius(2em);
	background-color:rgba(0, 0, 0, 0.3);
	.thumb-num{padding-left:0.2em;}
	&:hover,&.active{
		color:#fff;
		background-color:@red;
	}
	@media screen and (max-width:1270px){
		font-size:22px;
		i{font-size:22px;}
	}
	@media screen and (max-width:1024px){
		font-size:20px;
		i{font-size:20px;}
	}
	@media screen and (max-width:768px){
		font-size:18px;
		i{font-size:18px;}
	}
}

.thumb-box{
	padding-top:0.5em;
}


//精彩欣赏
.adventure-content{
	padding-top:56px;
	padding-bottom:100px;
	.switch-nav-box{margin-bottom:46px;}
	.switch-nav{
		width:100%;
		.nav-item{
			width:100%/5;
			padding:1.7em 0.5em;
			font-size:22px;
			line-height:1;
			background-color:#bdbdbd;
			.text-overflow;
		}
	}
	.list{
		margin-left:-15px;
		margin-right:-15px;
		.item{
			width:100%/3;
			padding:0 15px;
			float:left;
			margin-bottom:32px;
			.item-inner{
				box-shadow: 2.5px 4.33px 24px 6px rgba( 46, 46, 46,0.1);
			}
			.item-header{
				position:relative;
				.btn-group{
					position:absolute;
					top:18px;
					right:18px;
					.btn{
						color:#fff;
						font-size:24px;
						padding:0.4em 1em;
						border:0;
						.border-radius(2em);
						line-height:1;
						background-color:rgba(0, 0, 0, 0.2);
						i{font-size:24px;}
						&:hover,&.active{
							background-color:rgba(216, 43, 42, 0.8);
						}
					}
				}
				.img-link{display:block;}
			}
			.item-body{
				padding:20px;
				color:#666;
				.item-title{
					font-size:20px;
					line-height:1.25;
					font-weight:600;
					margin-bottom:0.5em;
					color:#333;
					.text-overflow;
				}
				.item-detail{font-size:14px; line-height:1.625;}
			}
			.item-footer{
				padding:20px;
				color:#666;
				font-size:14px;
				background-color: #f6f6f6;
				border-top:1px solid #ececec;
				.address-info{
					line-height:20px;
					i{padding-right:0.3em; font-size:20px;}
				}
			}
		}
	}
	@media screen and (max-width:1270px){
		.switch-nav-box{margin-bottom:40px;}
		.switch-nav{
			.nav-item{
				padding:1.5em 0.5em;
				font-size:20px;
			}
		}
		.list{
			.item{
				margin-bottom:30px;
				.item-header{
					.btn-group{
						.btn{font-size:22px;}
					}
				}
				.item-body{
					.item-title{font-size:18px;}
				}
			}
		}
	}
	@media screen and (max-width:1024px){
		.switch-nav-box{margin-bottom:36px;}
		.switch-nav{
			.num{display:none;}
			.nav-item{
				padding:1.5em 0.5em;
				font-size:20px;
			}
		}
		.list{
			margin-left:-10px;
			margin-right:-10px;
			.item{
				padding:0 10px;
				margin-bottom:30px;
				.item-header{
					.btn-group{
						top:15px;
						right:15px;
						.btn{font-size:20px;}
					}
				}
				.item-body{
					.item-title{font-size:16px;}
				}
			}
		}
	}
	@media screen and (max-width:768px){
		.switch-nav-box{margin-bottom:30px;}
		.switch-nav{
			background-color:transparent;
			.nav-item{
				font-size:18px;
			}
		}
		.list{
			margin-left:-10px;
			margin-right:-10px;
			.item{
				padding:0 10px;
				margin-bottom:30px;
				width:100%/2;
			}
		}
	}
	@media screen and (max-width:640px){
		padding-top:56*@rpx;
		padding-bottom:100*@rpx;
		.switch-nav-box{
			margin-left:-30*@rpx;
			margin-right:-30*@rpx;
			margin-bottom:20px;
			overflow-x:scroll;
		}
		.switch-nav{
			width:8em*5;
			font-size:14px;
			.nav-item{
				font-size:14px;
				padding-left:1em;
				padding-right:1em;
				padding-top:1em;
				padding-bottom:1em;
				text-overflow: initial;
			}
		}
		.list{
			margin-left:0;
			margin-right:0;
			.item{
				width:100%;
				padding:0;
				margin-bottom:32*@rpx;
				.item-header{
					.btn-group{
						top:10px;
						right:10px;
						.btn{font-size:22px;}
					}
					.img-link{img{width:100%;}}
				}
				.item-body{padding:15px;}
				.item-footer{
					padding:15px;
				}
			}
		}
	}
}


//探险队弹层
.swiper-cover{
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	bottom:0;
	right:0;
	z-index:9999;
	padding:50px;
	background-color:rgba(0, 0, 0, 0.8);
	//display:none;
	.swiper-cover-inner{
		position:relative;
		height:100%;
		width:100%;
		max-width:1170px;
		margin-left:auto;
		margin-right:auto;
	}
	.swiper-detail{
		width:100%;
		height:560px;
		position:absolute;
		top:50%;
		padding-right:320px;
		//.translate3d(0,-50%,0);
		margin-top:-280px;
		background-color:#fff;
		.btn-close{
			position:absolute;
			top:0;
			right:-50px;
			border:0;
			line-height:1;
			color:#fff;
			z-index:99;
			background-color:transparent;
			i{font-size:30px; line-height:1;}
		}
	}
	.swiper-box{
		width:100%;
		height:100%;
		.cover-swiper{width:100%; height:100%;}
		.swiper-slide{
			text-align:center;
			.vertical-center;
		}
		video{
			width:100%;
			height:100%;
		}
	}
	.cover-button-prev,.cover-button-next{
		@size:68px;
		width:@size;
		height:@size;
		text-align:center;
		background-color:rgba(0, 0,0, 0.5);
		position:absolute;
		top:50%;
		z-index:99;
		color:#fff;
		cursor:pointer;
		margin-top:-@size/2;
		i{font-size:40px; line-height:@size;}
		&:hover{
			background-color:@red;
		}
		&.swiper-button-disabled{
			display:none;
			&:hover{background-color:rgba(0, 0,0, 0.5);}
		}
	}
	.cover-button-prev{left:28px;}
	.cover-button-next{right:28px;}
	.sidebar{
		width:320px;
		padding:50px 32px;
		position:absolute;
		top:0;
		right:0;
		font-size:14px;
		max-height:100%;
		//overflow-y:scroll;
		.sidebar-title{
			font-weight:normal;
			font-size:28px;
			line-height:1.25;
		}
		.sidebar-detail{
			padding:20px 0;
			color:#666;
		}
		.sidebar-footer{
			padding:20px 0;
			border-top:1px solid #ececec;
		}
	}
	@media screen and (max-width:1270px){
		.swiper-box{
			width:100%;
			height:480px;
		}
		.cover-button-prev,.cover-button-next{
			@size:50px;
			width:@size;
			height:@size;
			margin-top:-@size/2;
			i{font-size:36px; line-height:@size;}
		}
		.cover-button-prev{left:20px;}
		.cover-button-next{right:20px;}
		.swiper-detail{
			height:478px;
			margin-top:-239px;
			.btn-close{
				right:-40px;
			}
		}
	}
	@media screen and (max-width:1024px){
		.cover-button-prev,.cover-button-next{
			@size:40px;
			width:@size;
			height:@size;
			margin-top:-@size/2;
			i{font-size:30px; line-height:@size;}
		}
		.cover-button-prev{left:15px;}
		.cover-button-next{right:15px;}
		.swiper-detail{
			position:relative;
			.btn-close{
				//top:-40px;
				//right:0;
				i{font-size:26px;}
			}
		}
	}
	@media screen and (max-width:992px){
		.swiper-cover-inner{position:static; background-color:#fff; overflow-y:scroll;}
		.swiper-box{
			height:400px;
		}
		.swiper-detail{
			position:static;
			top:inherit;
			height:auto;
			margin-top:0;
			padding-right:0;
			.btn-close{
				top:10px;
				right:10px;
				i{font-size:26px;}
			}
		}
		.sidebar{
			width:100%;
			height:auto;
			padding:40px 30px;
			position:static;
			overflow-y:auto;
		}
	}
	@media screen and (max-width:768px){
		.swiper-box{
			height:300px;
		}
		.sidebar{
			padding:36px 24px;
			.sidebar-title{font-size:24px;}
		}
	}
	@media screen and (max-width:640px){
		padding:50px 50*@rpx;
		.swiper-box{
			height:220px;
		}
		.sidebar{
			padding:50*@rpx 42*@rpx;
			.sidebar-title{font-size:20px;}
			.sidebar-detail{padding:0.8em 0;}
		}
	}
}

